<template>
	<div class="container">
		<ChatHeader />
		<div class="chat-container">
			<div class="body-container">
				<ChatBodyLeft />
				<ChatBodyRight />
			</div>
		</div>
	</div>
</template>

<script>
import ChatHeader from "./ChatHeader.vue";
import ChatBodyLeft from "./ChatBodyLeft.vue";
import ChatBodyRight from "./ChatBodyRight.vue";
export default {
	name: "Chat",
	components: {
		ChatHeader,
		ChatBodyLeft,
		ChatBodyRight
	}
};
</script>

<style scoped lang="less">
.container {
	height: 100%;
	min-width: 800px;
	min-height: 550px;
}
.chat-container {
	height: 100%;
	.body-container {
		display: flex;
		height: 100%;

		background-color: #2b2b2b;
	}
}
</style>
